<#import "../common/layout.ftl" as layout/>
<#import "../common/modern-forms.ftl" as mform/>
<#import "../common/modal.ftl" as modal/>
<#import "../common/dataTables.ftl" as dataTables/>
<!DOCTYPE html>
<html>
<@layout.head title="二维码打印">
    <@mform.head/>
    <@dataTables.head/>
    <@dataTables.buttons_head/>
    <@dataTables.select_head/>
    <@dataTables.editor_head/>
<link rel="stylesheet" type="text/css" href="${request.contextPath}/assets/printer/printPage.css?v=3653060703">
<script src="${request.contextPath}/assets/js/jquery-1.12.4.min.js?v=3653060703" type="text/javascript"></script>
<script src="${request.contextPath}/assets/js/json2.js?v=3653060703" type="text/javascript"></script>
<script src="${request.contextPath}/assets/printer/printer.js?v=3653060703" type="text/javascript"></script>
<script src="${request.contextPath}/assets/user/js/tools/qrcode.min.js?v=3653060703"></script>

<style type="text/css" media=print>
    #header, .top_title, #jqprint, #footer, #cssprint {
        display: none
    }

    .Noprint {
        display: none
    }

    .Noboder {
        border: 0px solid #000;
        margin: 0px;
        height: 10px;
        width: auto;
    }

    .pages {
        border: 0px solid #000;
        margin: 0px;
    }

    .Minprint {
        height: auto;
        width: 277mm;
        border: 0px solid #666666;
    }

    .PageNext {
        page-break-after: always;
    }

    .Hidden {
        visibility: hidden;
    }
</style>
<style>
    .pages{
    }
    .qrbox{
        margin:15px 10px 0px 10px;
        position: relative;
        height:calc(100% - 20px);
    }
    .qrbox .img{
        position: absolute;
        height:7px;
        top:0px;
        left:10px;
    }
    .qrbox .icon{
        border-radius: 5px;
        width:40px;
        height:40px;
        position: absolute;
        left:50px;
        top:50px;
        border:4px solid #ccc;
    }
    .qrbox .qrcode{
        position: absolute;
        top:10px;
        left:10px;
        font-size: 12px;
        line-height: 20px;
    }
    .t1{
        position: absolute;
        font-size: 8px;
        line-height: 1em;
        top:0px;
        left:0px;
    }
    .t2{
        position: absolute;
        font-size: 22px;
        line-height: 1.5em;
        top:-10px;
        right:-20px;
        font-weight: 600;
        transform:scale(0.5);
    }
    .t4{
        position: absolute;
        font-size:10px;
        font-weight:600;
        line-height: 1em;
        bottom:-3px;
        left:3px;
        white-space: nowrap;
    }
    .t3{
        position: absolute;
        width:70mm;
        font-size:16px;
        font-weight:600;
        line-height: 1.1em;
        bottom:4px;
        right:-60px;
        transform:scale(0.5);
        text-align: right;
    }
</style>
</@layout.head>
<body style="background-color: #CCCCCC;">
<div class="tool Noprint">
    <table width="1000" border="0" align="center" cellpadding="2" cellspacing="0">
        <tr style="display: none">
            <td width="67" rowspan="2" align="right">打印设置</td>
            <td width="68" align="right"><label for="paper">纸张</label></td>
            <td width="151" colspan="3"><select name="paper" class="paper" id="paper">
                <option value="A4">A4(210mm×297mm)</option>
            </select></td>
            <td width="48" align="right"><input type="radio" name="radio" id="y" value="y"/></td>
            <td width="51" align="left"><label for="x">纵向</label></td>
            <td width="24" align="left">&nbsp;</td>
            <td width="59" align="right"><label for="top">上边距</label></td>
            <td width="71"><input name="top" type="text" class="padding" id="top"/>
                mm
            </td>
            <td width="55" align="right">下边距</td>
            <td width="66" align="left"><input name="bottom" type="text" class="padding" id="bottom"/>
                mm
            </td>
        </tr>
        <tr style="display: none">
            <td align="right">每页</td>
            <td width="55"><input name="pageSize" type="text" class="padding" id="pageSize"/>
                条
            </td>
            <td width="50" align="right">字号</td>
            <td width="46"><select name="fontSize" class="paper" id="fontSize">
                <option value="12">12</option>
            </select></td>
            <td align="right"><input type="radio" name="radio" id="x" value="x"/></td>
            <td align="left"><label for="x">纵向</label></td>
            <td>&nbsp;</td>
            <td align="right"><label for="left">左边距</label></td>
            <td><input name="left" type="text" class="padding" id="left"/>
                mm
            </td>
            <td align="right">右边距</td>
            <td align="left"><input name="right" type="text" class="padding" id="right"/>
                mm
            </td>
        </tr>
        <tr>
            <td colspan="12" align="center">
                <input name="print" type="button" class="bt" value="开始打印" onclick="printIE();"/>
            </td>
        </tr>
    </table>
    <br/>
</div>
<div style="height:50px" class="Noprint"></div>
<div class="printPaper Noboder" id="printPaper">

</div>
<@layout.foot>
    <@mform.foot/>
    <@dataTables.foot/>
    <@dataTables.buttons_foot/>
    <@dataTables.select_foot/>
    <@dataTables.editor_foot/>
<script>
    var codes="${QRcodes}".split(",");
    var certCodes="${certCodes}".split(",");

    for(var i=0;i<codes.length;i++){
        var nowPage=$("<div class=\"pages PageNext\">\n" +
                "    </div>");
        $("#printPaper").append(nowPage);
        var row=$("<div class='qrbox'>" +
                "<div id='qrcode"+i+"' class='img'></div>" +
//                "<div class='qrcode'>"+codes[i]+"</div>" +
//                "<div class='t1'>行政信息管理系统专用二维码</div>" +
                "<div class='t2'>固定资产标签<br>请勿擅自损坏</div>" +
                "<div class='t4'>"+(certCodes[i]||"")+"</div>" +
                "<div class='t3'>${systemComName}<br>${systemDeptName}宣</div>" +
                "</div>");
        nowPage.append(row);
        var baseUrl=window.location.href;
        baseUrl=baseUrl.substr(0,baseUrl.indexOf(".cn/")+4)+"/edetail/"+codes[i];
        var qrcode = new QRCode('qrcode'+i, {
            text: baseUrl,
            width: 70,
            height: 70,
            colorDark : '#333',
            colorLight : '#fff',
            correctLevel : QRCode.CorrectLevel.M
        });
//        row.append("<img class=\"icon\" src='/assets/user/images/minLogo.jpg'/>")
    }

</script>
</@layout.foot>
</body>
</html>